<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="Expires" content="0">

  <meta http-equiv="Pragma" content="no-cache">

  <meta http-equiv="Cache-control" content="no-cache">

  <meta http-equiv="Cache" content="no-cache">
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>今日金价</title>
  <link rel="stylesheet" href="./css/main.css" />
  <link rel="stylesheet" href="./css/style.css" />
  <style>
    .colorRed {
      color: red;
    }

    .colorGreen {
      color: green;
    }

    .ininfo {
      line-height: 3;
      font-size: 20px;
    }

    td,
    th {
      text-align: center;
    }

    .todayPriceTable .ininfo:nth-child(n+4),
    .todayPriceTable th:nth-child(3),
    .todayPriceTable .ininfo td:nth-child(3) {
      display: none;
    }

    .pinpai th:nth-child(2),
    .pinpai tr td:nth-child(2) {
      display: none;
    }

    .todayTitle {
      text-align: center;
      line-height: 3;
      font-size: 20px;
    }
  </style>
</head>

<body>
  <nav class="navbar navbar-expand-lg bg-primary bg-gradient navbar-dark shadow fixed-top">
    <div class="container">
      <a href="./index.html" class="navbar-brand">返回</a>
    </div>
  </nav>
  <section>
    <div class="container">
      <div class="row">
        <p class="mb-3 fs-2 text-center displayNone" id="goldPriceTxt"></p>

        <div id="app">
          <div v-html="message"></div>
          <div v-html="message2"></div>
        </div>
      </div>
    </div>
  </section>
  <script src="./js/jquery.min.js"></script>
  <script src="./js/vue.min.js"></script>
  <script>

    //获取当前的毫秒数
    var timestamp = new Date().getTime();

    function ntimestamp() {
      return 't=' + new Date().getTime();
    }

    //在URL上设置时间戳
    function setUrlStamp(url) {
      if (url.indexOf("?") != -1) {
        url = url + "&" + ntimestamp();
      } else {
        url = url + "?" + ntimestamp();
      }
      return url;
    }
    if (!location.href.includes('?')) {
      location.href = setUrlStamp("goldPrice.html");
    }
    var app = new Vue({
      el: '#app',
      data: {
        message: '',
        message2: '',
      },
      methods: {
        timestampToTime() {
          var date = new Date();//时间戳为10位需*1000，时间戳为13位的话不需乘1000
          var Y = date.getFullYear() + '-';
          var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
          var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + '';
          var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
          var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
          var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
          return `${Y}${M}${D}`;
        },
        timestamp(url) {
          //  var getTimestamp=Math.random();
          var getTimestamp = this.timestampToTime();
          if (url.indexOf("?") > -1) {
            url = url + "&timestamp=" + getTimestamp
          } else {
            url = url + "?timestamp=" + getTimestamp
          }
          return url;
        },
        getFile() {
          let dateStr = this.timestampToTime()
          $.get(`filename${dateStr}.ttt`, (xml) => {
            //这里用于解析XML
            xml = xml.replace('<table width="100%" border="0" cellspacing="0" cellpadding="0" >', '<table class="table todayPriceTable table-bordered"><thead><tr><th scope="col">品类</th><th scope="col">开盘价</th><th scope="col">收盘价</th><th scope="col">最高价</th><th scope="col">最低价</th></tr></thead>')
            this.message = xml
          });
          $.get(`filesname${dateStr}.ttt`, (xml) => {
            //这里用于解析XML
            xml = xml.replace('[', '')
            xml = xml.replace(']', '')
            xml = xml.replace(',', '')
            xml = xml.replace(/回收价格/g, '')
            xml = xml.replace('<table>', '<div class="todayTitle">各大品牌价格</div><table class="table pinpai table-bordered">')
            xml = xml.replace('<table>', '<div class="todayTitle">今日回收价格</div><table class="table table-bordered">')
            this.message2 = xml
            console.log(xml,dateStr, 'sssss');
          });
        }
      },
      mounted() {
        let dateStr = this.timestampToTime()
        if (!location.href.includes(dateStr)) {
          location.href = this.timestamp("goldPrice.html");
        }
        this.getFile()
        setInterval(() => {
          this.getFile()
        }, 1000 * 60 * 5)
      }
    })


  </script>
</body>

</html>